<template>
	<view class="content">
		<view class="avatar" @click="exit">
			<fui-avatar :src="user.avatar"></fui-avatar>
			<view class="text-area" style="display: flex;flex-direction: column;">
				<text class="title">{{user.username}}</text>
			</view>
		</view>
		<fui-grid :showBorder="false" :square="false" style="margin-top: 50rpx;margin-bottom: 50rpx;">
			<fui-grid-item v-for="(item,index) in tabs" :key="index" @click="change(index)">
				<view class="fui-grid__cell" style="display: flex;align-items: center;justify-content: center;">
					<fui-icon name="cart"></fui-icon>
					<text>{{item}}</text>
				</view>
			</fui-grid-item>
		</fui-grid>
		<fui-section size="40" title="订单列表" style="margin-top: 40rpx;">

		</fui-section>
		<view style="width: 100%;display: flex;flex-direction: column;align-items: center;">
			<view class="list" v-for="(item,index) in list"
				@click="goUrl('/pages/msg/msg?purchase_code='+item.purchase_code)">
				<view>
					<view>供应商：{{item.supplyer_name}}</view>
					<view>订单编号：{{item.purchase_code}}</view>
				</view>
				<view style="font-size: 28rpx;color: red;">{{item.examine_status==1?'已审核':'待发货'}}</view>
			</view>
			<fui-empty title="暂无订单" v-if="list.length<=0"></fui-empty>
		</view>
		<fui-section size="40" title="消息列表" style="margin-top: 40rpx;">
			<view slot="right" style="position: absolute;right: 10rpx;" @click="goUrl('/pages/msg/msg')">更多</view>
		</fui-section>
		<view style="width: 100%;display: flex;flex-direction: column;align-items: center;">
			<view class="card" v-for="(item,index) in msglist" @click="msgRead(item.id,index)">
				<view style="margin-bottom: 10rpx;">{{item.title}}
					<fui-badge type="danger" dot style="position: absolute;right: 100rpx;"
						v-if="item.isred==0">未读</fui-badge>
				</view>
				<view style="margin-bottom: 10rpx;">{{item.content}}</view>
				<view style="color: #CCCCCC;font-size: 26rpx;">{{item.createtime}}
				</view>
			</view>
			<fui-empty title="暂无消息" v-if="msglist.length<=0"></fui-empty>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				title: 'Hello',
				user: [],
				list: [],
				msglist: [],
				supplyer_code: '',
				tabs: ['采购单', '退货单', '对账单']
			}
		},
		onLoad() {
			let token = this.$helper.getUserToken();
			this.supplyer_code = this.$helper.getUserShopid();
			this.user = uni.getStorageSync('user');
			let self = this;
			console.log(this.user)
			if (token == '') {
				uni.redirectTo({
					url: '/pages/login/login'
				})
			} else {
				this.$api.getIndex({}).then(res => {
					console.log(res)
					for (var i = 0; i < res.data.length; i++) {
						for (var s = 0; s < res.data[i].length; s++) {
							self.list.push(res.data[i][s])
						}
					}
					console.log(self.list)
				}).catch(err => {
					console.log(err)
					uni.showToast({
						title: err,
						icon: 'none'
					})
				})
				this.$api.getMsg().then(res => {
					self.msglist = res.data;
					uni.stopPullDownRefresh();
				}).catch(err => {
					console.log(err)
					uni.showToast({
						title: err,
						icon: 'none'
					})
					uni.stopPullDownRefresh();
				})
			}
		},
		onPullDownRefresh() {
			let self = this;
			console.log('下拉刷新');
			this.getData();
		},
		methods: {
			msgRead(id, index) {
				if (this.msglist[index].isred == 0) {
					this.msglist[index].isred = 1;
					this.$api.msgRead({
						id: id,
					}).then(res => {
						uni.showToast({
							title: '操作成功',
							icon: 'none'
						})
						console.log(res)
					}).catch(err => {
						console.log(err)
						uni.showToast({
							title: err,
							icon: 'none'
						})
					})
				}

			},
			getData() {
				let self = this;
				this.$api.getIndex({}).then(res => {
					self.list = [];
					for (var i = 0; i < res.data.length; i++) {
						for (var s = 0; s < res.data[i].length; s++) {
							self.list.push(res.data[i][s])
						}
					}
					console.log(self.list)
					uni.stopPullDownRefresh();
				}).catch(err => {
					console.log(err)
					uni.showToast({
						title: err,
						icon: 'none'
					})
					uni.stopPullDownRefresh();
				})
				this.$api.getMsg().then(res => {
					self.msglist = res.data;
					uni.stopPullDownRefresh();
				}).catch(err => {
					console.log(err)
					uni.showToast({
						title: err,
						icon: 'none'
					})
					uni.stopPullDownRefresh();
				})
			},
			change(e) {
				console.log(e)
				if(e==0){this.goUrl('/pages/order/order?type=' + e)}
				if(e==1){this.goUrl('/pages/order/order1?type=' + e)}
				if(e==2){this.goUrl('/pages/order/order2?type=' + e)}
				
			},
			goUrl(url) {
				uni.navigateTo({
					url: url
				})
			},
			exit() {
				uni.showModal({
					title: '提示',
					content: '确定要退出登录吗？',
					success: function(res) {
						if (res.confirm) {
							uni.clearStorageSync()
							uni.redirectTo({
								url: '/pages/login/login'
							})
							console.log('用户点击确定');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});

			},
		}
	}
</script>

<style>
	.list {
		width: 80%;
		border-width: 1px;
		border-style: solid;
		border-color: rgba(121, 121, 121, 1);
		border-radius: 8px;
		display: flex;
		font-size: 28rpx;
		align-items: center;
		justify-content: space-between;
		margin: 20rpx;
		padding: 20rpx;
	}

	.card {
		width: 80%;
		border-width: 1px;
		border-style: solid;
		border-color: rgba(121, 121, 121, 1);
		border-radius: 8px;

		margin: 20rpx;
		padding: 20rpx;
	}

	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.avatar {
		display: flex;
		width: 90%;
		justify-content: start;
		align-items: center;
		margin: 20rpx;
	}

	.text-area {
		margin-left: 40rpx;
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #000;
	}
</style>